<template>
  <div class="details" style="margin: 20px">
<!--    box-shadow: 0 2px 4px rgba(0, 0, 0, .12), 0 0 6px rgba(0, 0, 0, .04);-->
    <div style="background:#F8FBFF;border-radius: 10px">
      <div class="title" style="padding: 20px;border-bottom: 1px solid #D1D1D1; ">
        基本信息
      </div>
      <div class="details_name">
        <div class="details_name_item" >
          <div class="details_name_item1">
            保单号：{{formDate.insure_no}}
          </div>
          <div class="details_name_item1">
            在保人数：{{formDate.staff_count2}}
          </div>
          <div class="details_name_item1">
            保险公司：{{formDate.insure_name}}
          </div>
        </div>
        <div class="details_name_item">
          <div class="details_name_item1">
            保单状态：{{formDate.status2}}
          </div>
          <div class="details_name_item1">
            保险期间：{{formDate.insurance_time_start}} —— {{formDate.insurance_time_end}}
          </div>
<!--          <div>-->
<!--            单价：{{formDate.unit_price}}-->
<!--          </div>-->

        </div>
        <div class="details_name_item" >
          <div class="details_name_item1">
            业务类型：{{formDate.underwriting}}
          </div>
          <div class="details_name_item1">
            录单时间：{{formDate.create_time}}
          </div>
<!--          <div>-->
<!--           保费：{{formDate.sinsurance_fee_count}}-->
<!--          </div>-->

        </div>
      </div>
    </div>
    <div style="display: flex;justify-content: space-between">
      <div class="details_conter1" >
        <div class="title" style="padding: 20px;border-bottom: 1px solid rgba(0,0,0,.12)">
          被保人信息
        </div>
        <div class="details_conter1_item" >
                 <div class="details_conter1_item1" >
                    <div >被保人名称：{{ formDate.name2 }}</div>
                    <div style="width: 300px;">统一社会信用代码：{{formDate.credit_no}}</div>
                 </div>
          <div class="details_conter1_item1" >
            <div >行业类别：{{ formDate.industry }}</div>
            <div style="width: 300px;display: flex;justify-content: space-between"><span>负责人：{{ formDate.contact_person2 }}</span> <span style="margin-left: 5px">电话: {{formDate.phone2}}</span></div>
          </div>
          <div class="details_conter1_item1" >
            <div style="width: 300px;margin-left: 10px">邮编：{{formDate.email_code2}}</div>
            <div style="width: 300px;">邮箱：{{formDate.email2}}</div>
          </div>
          <div class="details_conter1_item1" >
            <div >地址：{{ formDate.mail_address2 }}</div>

          </div>
          <div class="details_conter1_item1" >
            <div >营业范围：{{ formDate.business_scope2 }}</div>

          </div>
          <div style="display: flex">
            <div >营业执照：</div>
            <div ><img :src="formDate.business_img" ></div>
          </div>
        </div>
      </div>
      <div  class="details_conter1" >
        <div class="title" style="padding: 20px;border-bottom: 1px solid rgba(0,0,0,.12)">
         投保人信息
        </div>
        <div  class="details_conter1_item"  >
          <div class="details_conter1_item1"  >
            <div >投保人名称：{{formDate.name1}}</div>
            <div style="width: 300px;">统一社会信用代码：{{formDate.credit_no2}}</div>
          </div>
          <div class="details_conter1_item1"  >
            <div >邮箱：{{formDate.email1}}</div>
            <div style="width: 300px;display: flex;justify-content: space-between"><span>负责人: {{formDate.contact_person1}}</span> <span style="margin-left: 5px">电话: {{formDate.phone1}}</span>  </div>
          </div>
          <div class="details_conter1_item1"  >
            <div style="width: 300px">地址：{{ formDate.mail_address1 }}</div>
            <div style="width: 300px;margin-left: 10px">邮编：{{formDate.email_code1}}</div>
          </div>

        </div>
      </div>
    </div>

  </div>
</template>

<script>
import {getInsureEli1} from '@/api/insurance/insureEli'

export default {
  name: "details12",
  data() {
    return {
      // 保单id
      id: '',
      formDate:{}
    }
  },
  methods: {
    getDetails() {
      getInsureEli1(this.id).then(res => {
        if(res.code==1){
          this.formDate=res.data
        }
        // console.log('详情', res)
      })
    }
  },
  created() {
    var insureInfo = this.$route.query.insureInfo
    if (insureInfo.id != undefined) {
      this.id = insureInfo.id
    }
    this.getDetails();
    // console.log('insureInfo', insureInfo)
  }
}
</script>

<style scoped lang="scss">
.details{
  font-family: Microsoft YaHei;
  font-weight: 400;
  color: #242424;
  .title{
    font-size: 26px;

  }
  .details_name{
    font-size: 20px;
    padding: 20px;
    display: flex;
    justify-content: space-between;
    color: #333333;
    .details_name_item{
      width: 500px;
     .details_name_item1{
       margin-bottom: 10px;
     }
    }
  }
  .details_conter1{
    background:#F8FBFF;
    border-radius: 10px;
    margin: 10px 10px 10px 0;
    width: 50%;
    font-size: 15px;
    .details_conter1_item{
      //background: pink;
      padding: 20px;
      .details_conter1_item1{
        display: flex;
        justify-content: space-between;
        margin-bottom: 10px;
      }
    }
  }
}

</style>
